<template>
  <div class="usersadmin">
    <el-row>
      <el-col :span="24">
        <el-table
          ref="filterTable"
          :data="tableData"
          style="width: 100%"
          size="mini"
        >
          <el-table-column prop="userimg" label="头像" width="75">
            <template slot-scope="scope">
              <img :src="scope.row.userimg" style="width: 55px; height: 55px" />
            </template>
          </el-table-column>
          <el-table-column prop="username" label="用户名"> </el-table-column>
          <el-table-column prop="name" label="昵称" width="180">
          </el-table-column>

          <el-table-column
            prop="role"
            fixed="right"
            label="角色"
            width="100"
            :filters="[
              { text: 'admin', value: 'admin' },
              { text: '普通用户', value: 'user' },
            ]"
          >
            <template slot-scope="scope">
              <el-tag
                :type="scope.row.role === 'admin' ? 'primary' : 'success'"
                disable-transitions
                >{{ scope.row.role }}</el-tag
              >
            </template>
          </el-table-column>
          <el-table-column
            prop="create_time"
            label="创建日期"
            sortable
            width="150"
            column-key="date"
          >
          </el-table-column>
        </el-table>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: "usersadmin",
  data() {
    return {
      tableData: [],
    };
  },
  mounted() {
    this.$axios.get("/admin/getall").then((res) => {
      // this.tableData = res.data.users;
      this.tableData = res.data.users.map((item) => {
        let time = item.create_time;
        item.create_time = this.$dayjs(time).format("YYYY-MM-DD HH:mm:ss");
        return item;
      });
      console.log("11", res);
    });
  },
};
</script>

<style scoped lang="scss">
.usersadmin {
  width: 100%;
}
</style>